import Axios from "axios";
import { Dialog } from "vant";
import { Toast } from "vant";
export default {
  state: {
    tableData: [],
    list: [
      /*  {
        checked: false,
        id: 11,
        title: "小米手机1",
        cover: require("@/images/demo/list/1.jpg"),
        // 选中商品属性
        attrs: [
          {
            title: "颜色",
            selected: 0,
            list: [
              {
                name: "火焰红",
              },
              {
                name: "炭黑",
              },
              {
                name: "冰川兰",
              },
            ],
          },
          {
            title: "容量",
            selected: 0,
            list: [
              {
                name: "32个GB",
              },
              {
                name: "128GB",
              },
            ],
          },
          {
            title: "套餐",
            selected: 0,
            list: [
              {
                name: "标配",
              },
              {
                name: "套餐一",
              },
              {
                name: "套餐二",
              },
            ],
          },
        ],
        pprice: 336,
        num: 1,
        minnum: 1,
        maxnum: 5, // 该商品最大商品数，跟库存有关
      },
      {
        checked: false,
        id: 12,
        title: "小米手机2",
        cover: require("@/images/demo/list/1.jpg"),
        // 选中商品属性
        attrs: [
          {
            title: "颜色",
            selected: 0,
            list: [
              {
                name: "火焰红",
              },
              {
                name: "炭黑",
              },
              {
                name: "冰川兰",
              },
            ],
          },
          {
            title: "容量",
            selected: 0,
            list: [
              {
                name: "64GB",
              },
              {
                name: "128GB",
              },
            ],
          },
          {
            title: "套餐",
            selected: 0,
            list: [
              {
                name: "标配",
              },
              {
                name: "套餐一",
              },
              {
                name: "套餐二",
              },
            ],
          },
        ],
        pprice: 200,
        num: 1,
        minnum: 1,
        maxnum: 10, // 该商品最大商品数，跟库存有关
      },
      {
        checked: false,
        id: 13,
        title: "小米手机3",
        cover: require("@/images/demo/list/1.jpg"),
        // 选中商品属性
        attrs: [
          {
            title: "颜色",
            selected: 0,
            list: [
              {
                name: "火焰红",
              },
              {
                name: "炭黑",
              },
              {
                name: "冰川兰",
              },
            ],
          },
          {
            title: "容量",
            selected: 0,
            list: [
              {
                name: "64GB",
              },
              {
                name: "128GB",
              },
            ],
          },
          {
            title: "套餐",
            selected: 0,
            list: [
              {
                name: "标配",
              },
              {
                name: "套餐一",
              },
              {
                name: "套餐二",
              },
            ],
          },
        ],
        pprice: 100,
        num: 2,
        minnum: 1,
        maxnum: 10, // 该商品最大商品数，跟库存有关
      }, */
    ],
    selectedAll: [],
  },
  getters: {
    // 购物车为空时出现购物车图标
    disSelect(state) {
      return state.list.length === 0;
    },
    // 购物车商品个数
    checkedAll(state) {
      return state.list.length === state.selectedAll.length;
    },
    // 计算总价
    totalPrice(state) {
      let total = 0;
      state.list.forEach((v) => {
        /* if(state.selectedAll.indexOf(v.id)!=-1){
					total += v.pprice * v.num
				} */
        if (v.checked) {
          total += v.pprice * v.num;
        }
      });
      return total;
    },
  },
  mutations: {
    initCartList(state, list) {
      state.list = list;
    },
    selectItem(state, index) {
      var id = state.list[index].id;
      var i = state.selectedAll.indexOf(id);
      if (i > -1) {
        // 取消当前商品选中状态
        state.list[index].checked = false;
        // 移除选中列表中的当前商品
        return state.selectedAll.splice(i, 1);
      }
      // 选中
      state.list[index].checked = true;
      state.selectedAll.push(id);
      console.log(state.selectedAll);
    },
    //全选
    selectAll(state) {
      state.selectedAll = [];
      state.list.map((v) => {
        v.checked = true;
        state.selectedAll.push(v.id);
      });
    },
    //全不选
    noselectAll(state) {
      state.list.map((v) => {
        v.checked = false;
      });
      state.selectedAll = [];
    },
    //删除商品
    delgoods(state) {
      if (state.selectedAll == "") {
        Toast("您的购物车已经没有商品了");
      } else {
        if (state.list.length === 0) {
          Toast("购物车已全部清空完毕");
        } else {
          Dialog.confirm({
            title: "是否删除您所勾选的商品？",
            message: "确定后将无法找回已选购的商品",
          })
            .then(() => {
              state.list = state.list.filter((v) => {
                console.log(state.selectedAll.indexOf(v.id) === -1);
                return state.selectedAll.indexOf(v.id) === -1;
              });
              state.selectedAll = []; //清空id
              Toast.success("已将所选商品从您的购物车中移除");
            })
            .catch(() => {
              // on cancel
            });
        }
      }
    },
    // 清空购物车
    clearCart(state) {
      (state.list = []), (state.selectAll = []);
    },
  },
  actions: {
    doselectAll({ getters, commit }) {
      // 传getters中的状态，如果全选按钮是开启的那么就返回全不选，否则就在跳回全选
      getters.checkedAll ? commit("noselectAll") : commit("selectAll");
    },
    updateCartList({ commit }) {
      Axios({
        url: "/cart",
        data: {},
        method: "get",
        headers: {
          token: true,
        },
      }).then((v) => {
        window.sessionStorage.setItem("cart", JSON.stringify(v.data));
        // commit('noselectAll')
        // 赋值

        commit("initCartList", v.data.data);
      });
    },
    dodelgoods({ commit, state }) {
      Axios({
        url: "/cart/delete",
        method: "POST",
        data: {
          shop_ids: state.selectedAll.join(","),
        },
        header: {
          token: true,
        },
      }).then((res) => {
        console.log(res);
      });
      commit("delgoods");
    },
  },
  modules: {},
};
